<template>
  <!-- <div class="logo">
    <div class="big">
      <div @click="dengru">
        <div class="dengru">注册</div>
      </div>
      <div @click="zhuce">
        <div class="dengru">登录</div>
      </div>
    </div>
  </div>-->
  <div class="divBox">
    <img class="bgImg" src="../../assets/images/logo.jpg">
    <div class="big">
      <div @click="dengru">
        <van-button plain class="dengru" type="primary" size="large">登录</van-button>
      </div>
      <div @click="zhuce">
        <van-button plain class="zhuce" type="danger" size="large">注册</van-button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  components: {},
  methods: {
    dengru() {
      this.$router.push({ name: "Login" });
    },
    zhuce() {
      this.$router.push({ name: "Register" });
    }
  },
  created(){
    if(localStorage.userInfo){
      this.$router.push({name:'ShoppingMall'})
    }
  }
};
</script>

<style lang="stylus" scoped>
body{
    position relative
}
.bgImg {
  position: fixed;
  width: 100%;
  height: 100%;
  object-fit: cover; // 这个属性好用
}
.big{
    width 10rem
    height 10rem

    position absolute
    left 50%
    top 50%
    margin -5rem 0 0 -5rem
    .dengru{
        margin-bottom 3rem
        border-radius 1rem
    }
    .zhuce{
        border-radius 1rem
    }
}
</style>

